 <html>

<style type="text/css">
 

	::-webkit-scrollbar{width:0px;background-color:#e1e5ea}
	::-webkit-scrollbar-thumb{background-color:#c3cad4;border-radius:10px;border:2px solid #e1e5ea;}
	::-webkit-scrollbar-thumb:hover{background-color:#aab1bc;}
	::-webkit-scrollbar-thumb:active{border:0;border-radius:0;background-color:#737ed7}
	::-webkit-scrollbar-thumb:window-inactive{background-color:#4c97da}




	 table th,td{
		border: solid 1px gray;
		border-top: none;
		border-right: none;
		width: 100px;
	}

	.container{
		width: 100%;
		border: solid 0px red;
		overflow: hidden;
	}

	.border-top{
		border-top: solid 1px gray;
	}
	 
	.top{
		height: 43px;
	}

	.top th{
		height: 42px;
		text-align: center;
	}
	.top-left{
		width:500px;
		float: left;
		position: relative;
	}

	.top-right{
		width:auto;
		overflow: hidden;
	}

	.bottom{
		max-height: 370px;
		height: 370px;
		overflow-y: auto;
	}
	.left{
		width:500px;
 		float: left;
 		max-height: 350px;
		height: 350px;
		position: relative;
		overflow: hidden;
	}

	.right{
		width:auto;
		max-height: 370px;
		height: 370px;
		overflow-x: auto;
	}

	#tbl-bottom-right tr:last-child{
		border-right: solid 1px gray;
	}

	 
</style> 
<body>

<div class = "container"  >
<div class="top">
	<div class="top-left">
		<table style="width: 100%" class="border-top" cellpadding="0" cellspacing="0">
			<tr class="head">
				<th>1</td>
				<th>2</td>
				<th>3</td>
				<th>4</td>
				<th>5</td>
			</tr>
		</table>
	</div>
	<div class="top-right" id="tbl-top-right">
	<table style="width: 2500px;" class="border-top"  cellpadding="0" cellspacing="0">
			<tr class="head">
				<th>22</th>
				<th>2</th>
				<th>3</th>
				<th>4</th>
				<th>5</th>
				<th>1</th>
				<th>2</th>
				<th>3</th>
				<th>4</th>
				<th>5</th>
				<th>1</th>
				<th>2</th>
				<th>3</th>
				<th>4</th>
				<th>5</th>
				<th>1</th>
				<th>2</th>
				<th>3</th>
				<th>4</th>
				<th>5</th>
				<th>1</th>
				<th>2</th>
				<th>3</th>
				<th>4</th>
			</tr>
		</table>
	</div>
</div>
	
<div  class="bottom">
	<div class="left">
		<table style="width: 100%"  cellpadding="0" cellspacing="0">
			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>
			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>
			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>

			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>
			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>
			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>

			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>

			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>

			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>

			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>

			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>

			<tr class="head">
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
			</tr>
		</table>
	</div>
	<div class="right" id="tbl-bottom-right"   onscroll="document.getElementById('tbl-top-right').scrollLeft = this.scrollLeft;">
	<table style="width: 2500px;" cellpadding="0" cellspacing="0">
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
			<tr class="head">
				<td>22</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				<td>5</td>
				<td>1</td>
				<td>2</td>
				<td>3</td>
				<td>4</td>
				 
			</tr>
		</table>
	</div>
</div>
</div>












 




</body>
 </html>